var CellItem = function() {
    return {
        name: 'CellItem',
        props: {
            params: {
                type: Number,
                default: function () {
                    return {};
                }
            }
        },
        template: `
            <div>
                <div>params = {{JSON.stringify(params)}}</div>
                <div>a = {{a}}</div>
                <button @click="add">add</button>
            </div>
        `,
        data () {
            return {
                a: 1
            }
        },
        methods: {
            add () {
                this.a++;
                this.params.react1++;
            }
        }
    };
}

var CellItemMixins = function () {
    return {
        name: 'CellItem2',
        mixins: [CellItem()],
        template: `
            <div>
                <div>a = {{a}} - {{a}}</div>
                <button @click="add">add+add</button>
                <hr/>
                <div>b = {{b}}</div>
            </div>
        `,
        data () {
            return {
                b: 'b'
            }
        }
    };
}

// Vue.component('cell-item', CellItem());
// Vue.component('cell-item-mixins', CellItemMixins());